/**
 * VUEshop
 * ============================================================================
 * * 版权所有 2015-2027 深圳搜豹网络科技有限公司，并保留所有权利。
 * 网站地址: http://www.vueshop.com.cn
 * ----------------------------------------------------------------------------
 * 这不是一个自由软件！您只能在不用于商业目的的前提下对程序代码进行修改和使用 .
 * 不允许对程序代码以任何形式任何目的的再发布。
 * ============================================================================
 * $Author: 沈小白 2020-07-22 $
 */<template> 
	<view class="container">
	   <view class="return-box" v-for="(item,index) in list" :key="index">
	        <view class="item">
	            服务单号：{{item.id}}
	            <text class="state">{{item.status_desc}}</text>
	        </view>
	        <navigator class="item" :url="'/pages/user/return_goods_info/return_goods_info?id='+item.rec_id">
	            <block v-if="item.status == -2">您的服务单已经取消</block>
	            <block v-else-if="item.status == -1">很抱歉！您的服务单未通过审核</block>
	            <block v-else-if="item.status == 0">您的服务单已申请成功，待售后审核中</block>
	            <block v-else-if="item.status == 1">您的服务单已通过审核</block>
	            <block v-else-if="item.status == 2">等待卖家签收</block>
	            <block v-else-if="item.status == 3 || item.type == 2">卖家已收到您寄回的物品,卖家已重新发货</block>
	            <block v-else-if="item.status == 5 || item.status == 4">您的服务单完成</block>
	            <image class="wh100 arrow" :src="imgUrl+'common/icon-arrowdown.png'"></image>
	        </navigator>
	        <view class="item return-goods">
	            <image class="wh100 goods_img" :src="hostUrl+'/mall/goods/thumb_image?goods_id='+ item.goods_id+'&width='+goodsImgWidth+'&height='+goodsImgHeight+'&'+item.goods_id+'.'+imgType"/>
	            <view class="goods-desc">
	                <view class="goods-name">{{item.goods_name}}</view>
	                <view class="apply-time">申请时间：{{item.add_time_format}}</view>
	            </view>
	        </view>
	        <navigator class="little-btn-1 foot-btn" :url="'/pages/user/return_goods_info/return_goods_info?id='+item.rec_id">进度查询</navigator>
	        <view class="little-btn-1 foot-btn" :data-id="item.id" @tap="receiveOrder" :hidden="!(item.status==2&&item.type==1)">确认收货</view> 
			<view class="little-btn-2 foot-btn" :data-id="item.id" @tap="cancelReturn" :hidden="!(item.status!=-2&&item.status<1)">取消申请</view> 
	    </view>
	    <view class="no-data"v-if="!list || list.length == 0">
	        <image :src="imgUrl+'cart/cart-null.png'" class="cart-image"/>
	        <view class="no-data-title">没有找到相关的记录</view>
	        <navigator url="/pages/index/index" class="lookat" open-type="switchTab"> 去逛逛 </navigator>
	    </view> 
	</view>
</template>

<script>
	import {getReturnGoodsPage,getTheGoods,putReturnStatus,} from "@/api/api.js";
	import config from "@/api/config.js";
	import common from "@/common/common.js";
	import {mapState} from 'vuex';
	export default {
		data() {
			return {
				imgUrl:config.imgUrl,
				list:"",
				hostUrl:config.host,
				params:{
					p:1,
				},
				total:"",
			};
		},
		computed: {
			...mapState(['hasLogin','imgType','goodsImgHeight','goodsImgWidth'])
		},
		onShow(){
			
			if(this.hasLogin){
				this.getReturnGoodsPage(this.params)
			}else{
			
				common.toast("none","请登录",2000)
				
			}
			
		},
		methods:{
			getReturnGoodsPage(params){
				getReturnGoodsPage(params).then(res=>{
					console.log(res)
					if(res){
						this.list=res.records
						this.total=res.total;
					}
					
				})
			},
			
			/*确认收货*/
			receiveOrder(e){
				  var that=this;
				   var id=e.currentTarget.dataset.id;
				 let params={
				 	id:id
				 }
				 uni.showModal({
					 title: '确定已收货？',
					 success: function (res) {
						 if (res.confirm) {
							 that.getTheGoods(params)
						 }
					 }
				 });
				
			 },
			/*确认收货*/
			getTheGoods(params){
				getTheGoods(params).then(res=>{
					console.log(res)
					if(res.status==1){
						this.getOrderPage(this.params)
					}
				})
			},
			/*取消退换货*/ 
			cancelReturn(e){
				console.log(e)
				 var that=this;
				 var id=e.currentTarget.dataset.id;
				
				 
				 uni.showModal({
					title: '确定取消售后服务？',
					success: function (res) {
						if (res.confirm) {
							that.putReturnStatus(id)
						}
					}
				});
							
			},
			/*取消退换货*/ 
			putReturnStatus(params){
				putReturnStatus(params).then(res=>{
					if(res.status== 1){
						this.getReturnGoods(options.id)
						common.toast("none","取消成功",3000)
						
					}
				}) 
			},
			onReachBottom(){//下拉加载数据
				
				if(this.list.length===this.total){
					common.toast("none","加载完了",2000)
					 return false;
				}
				this.params.p++;
				if(this.hasLogin){
					this.getReturnGoodsPage(this.params)
				}
				
				
			},
		}
	}
</script>

<style lang="scss">
/* return_goods_list.wxss */
.return-box{
    background-color: white;
    font-size: 30rpx;
    width: 710rpx;
    margin: 0 auto;
    border-radius: 10rpx;
    margin-bottom: 20rpx;
}
.return-box:first-child{
    margin-top: 20rpx;
}
.item {
    padding: 20rpx 25rpx;
    border-bottom: 3rpx  solid #f3f3f3;
    height: 38rpx;
    font-size: 28rpx;
}
.state{
    color: red;
    float: right;
}
.arrow {
    margin-top: 5rpx;
    width: 25rpx;
    height: 28rpx;
    float: right;
}
.return-goods{
    height: 100rpx;
}
.goods_img{
    height: 100rpx;
    width: 100rpx;
    float: left;
}
.goods-desc{
    padding-left: 30rpx;
    width: 530rpx;
    float: left;
}
.goods-name{
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    padding-bottom: 35rpx;
}
.apply-time{
    font-size: 26rpx;
    color: #999999;
}
.return-btn{
    float: right;
    border: 1rpx  solid #f3f3f3;
    padding: 8rpx;
    margin: 20rpx 25rpx;
    font-size: 24rpx;
    border-radius: 6rpx;
}
.foot-btn{
  float: right;
  margin: 20rpx 25rpx 20rpx 0rpx;
}
</style>
